<script setup lang='ts'>
import Layout from '~@/components/Layout/index.vue'
import Avatar from '~@/components/Avatar/index.vue'
import avatarImg from './src_images/avatar1.jpg'
console.log(avatarImg);
console.dir(avatarImg)

    
</script>
<template>
    <div class="my-app-container">
        <Layout>
            <template #left>
                <div>app left aabdddbba</div>
                <Avatar url="public_images/avatar1.jpg"/>
                <Avatar url="http://mdrs.yuanjin.tech/FgMwAPYq17So9nwVH44ltDHo7u3c"/>
                <Avatar :url="avatarImg"/>

            </template>
            <template #main>
                <div>app main</div>
            </template>
            <template #right>
                <div>app right</div>
            </template>
        </Layout>
    </div>


    <div>
        <h2>My App</h2>
        <RouterView></RouterView>
    </div>
</template>
<style lang='less' scoped>
@import "~@/styles/var.less";
@import url('~@/styles/mixin.less');

h2{
    color:@primary;
}

.my-app-container{
    .self-fill(fixed);
}

</style>